import React from 'react';
import { connect } from 'react-redux';
import BaseComponent from '../../components/common/baseComponent.js';
import couponIcon from '../../../assets/images/cq/coupon/coupon_shell_banner.png';
import StationList from '../oilStation/stationList';

import {
  // OLD_CARD_EXCHANGE,
  // OLD_COUPON_EXCHANGE,
  OLD_CQ_GIFT,
  // OLD_SHELL_GIFT,
  // OLD_COUPON_LIST, OLD_ORDER_LIST,
} from '../../constants/setting';

@connect(() => {
  return {};
})
class Home extends BaseComponent {
  state = {
    showBanner: true,
  }

  typeChanged = (showMap) => {
    this.setState({ showBanner: !showMap });
  }

  goGiftCq = () => {
    window.location.href = OLD_CQ_GIFT;
  }

  goMoreCoupon = () => {
    this.props.history.push('moreCoupon');
  }
  render() {
    const { showBanner } = this.state;
    let banner;
    if (showBanner) {
      banner = <img src={couponIcon} alt="" className="coupon-icon" onClick={this.goGiftCq} />;
    }

    const cls = {
      filterCls: 'station-filter-cq',
    };

    return (
      <div className="home-cq">
        {banner}
        <div className="home-container">
          <StationList {...this.props} typeChanged={this.typeChanged} cls={cls} />
        </div>
      </div>
    );
  }
}

export default Home;
